<?php

/* @var $this yii\web\View */

$this->title = 'Dashboard';
?>
<section class="content">
    <!-- Small boxes (Stat box) -->
    <div class="row">
        <div class="col-lg-3 col-xs-6">
            <!-- small box -->
            <div class="small-box bg-aqua">
                <div class="inner">
                    <h3>150</h3>
                    <p>New Orders</p>
                </div>
            </div>
        </div>

        <!-- ./col -->
        <div class="col-lg-3 col-xs-6">
            <!-- small box -->
            <div class="small-box bg-green">
                <div class="inner">
                    <h3>53<sup style="font-size: 20px">%</sup></h3>

                    <p>Bounce Rate</p>
                </div>
            </div>
        </div>
    </div>


    <div class="row">
        <!-- AREA CHART -->
        <div class="col-lg-6 col-xs-12">
            <div class="box box-primary">
                <div class="box-header with-border">
                    <h3 class="box-title">Area Chart</h3>
                </div>
                <div class="box-body">
                    <canvas id="open-chart"></canvas>
                </div>
            </div>

            <!-- /.box -->
        </div>
    </div>
</section>


<!--<script src="/js/jquery-2.2.3.min.js"></script>-->
<!--<script src="/plugins/chart/chart.umd.js"></script>-->
<!--<script>-->
<!--    // import Chart from 'chart.js/auto'-->
<!--    --><?php
//        $data = \ua_backend\models\Statistics::getData();
//    ?>
//
//    (async function() {
//        const data = [
//            { date: "2024-06-04", open: 10, join: 20},
//            { date: "2024-06-05", open: 10, join: 30 },
//            { date: "2024-06-06", open: 15, join: 20 },
//            { date: "2024-06-07", open: 25, join: 40 },
//            { date: "2024-06-08", open: 22, join: 20 },
//            { date: "2024-06-09", open: 30, join: 50 },
//            { date: "2024-06-10", open: 28, join: 20 },
//        ];
//
//        new Chart(
//            document.getElementById('open-chart'),
//            {
//                type: 'line',
//                data: {
//                    labels: data.map(row => row.date),
//                    datasets: [
//                        {
//                            label: '直接进入',
//                            data: data.map(row => row.open)
//                        },
//                        {
//                            label: '邀请加入',
//                            data: data.map(row => row.join)
//                        }
//                    ]
//                },
//                options: {
//                }
//            }
//        );
//    })();
//</script>
